<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<script src="https://qbulrc.googlecode.com/svn/jquery-1.11.0.min.js"></script>
<script src="https://qbulrc.googlecode.com/svn/jquery.bxslider.min.js"></script>

<style>
.drl_rightnav_growtext .wrap .caption {  top:50%;} 
.drl_rightnav_growtext .wrap { margin-top:-10px; border:10px solid #fff; display: inline-block; text-align: justify; position: relative; -webkit-box-shadow: 5px 5px 5px #111;           box-shadow: 5px 5px 5px #111; } 
.drl_rightnav_growtext .display { position: relative; overflow: hidden; } 
.drl_rightnav_growtext .display img { display: block; width:140px; height:190px; } 
.drl_rightnav_growtext .caption { position: absolute;width: 100%; height: 100%; padding: 5px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; background: rgba(0,0,0,0.6); color: #fff; top: 100%; -webkit-transition: all 0.5s ease-in 0s; -moz-transition: all 0.5s ease-in 0s; -o-transition: all 0.5s ease-in 0s; transition: all 0.5s ease-in 0s; } 
.drl_rightnav_growtext .growtext {margin-top:10px;text-align:left;} 
.drl_rightnav_growtext a .growtext  {color:#fff; font-size: 12px; text-decoration:none;}
.drl_rightnav_growtext a:hover .growtext  { text-decoration:underline;}
.drl_rightnav_growtext .wrap { border:10px solid #fff; display: inline-block; text-align: justify; position: relative; -webkit-box-shadow: 5px 5px 5px #111;           box-shadow: 5px 5px 5px #111; } 
</style>
</head>
<body style="width:629px; margin:0;" >
<div style= "margin-top:-20px;" class= "drl_rightnav_growtext">
<ul class="bxslider">
           <td>
         <div class="wrap">
            <div class="display">
            <a href="http://koha.dreamlib.vn/cgi-bin/koha/opac-detail.pl?biblionumber=10" target="_blank">
            <img  src="http://koha.dreamlib.vn/cgi-bin/koha/opac-image.pl?thumbnail=1&biblionumber=10">
            <div class="caption">
            <div class="growtext">Ace the ielts</div>
            </div>
            </div>
            </a>
         </div>
       </td>
         <td>
         <div class="wrap">
            <div class="display">
            <a href="http://koha.dreamlib.vn/cgi-bin/koha/opac-detail.pl?biblionumber=9" target="_blank">
            <img  src="http://koha.dreamlib.vn/cgi-bin/koha/opac-image.pl?thumbnail=1&biblionumber=9">
            <div class="caption">
            <div class="growtext">Du lịch</div>
            </div>
            </div>
            </a>
         </div>
       </td>
         <td>
         <div class="wrap">
            <div class="display">
            <a href="http://koha.dreamlib.vn/cgi-bin/koha/opac-detail.pl?biblionumber=1" target="_blank">
            <img  src="http://koha.dreamlib.vn/cgi-bin/koha/opac-image.pl?thumbnail=1&biblionumber=1">
            <div class="caption">
            <div class="growtext">Tiểu sử steve jobs</div>
            </div>
            </div>
            </a>
         </div>
       </td>
         <td>
         <div class="wrap">
            <div class="display">
            <a href="http://koha.dreamlib.vn/cgi-bin/koha/opac-detail.pl?biblionumber=5" target="_blank">
            <img  src="http://koha.dreamlib.vn/cgi-bin/koha/opac-image.pl?thumbnail=1&biblionumber=5">
            <div class="caption">
            <div class="growtext">Nơi trái tim hôi ngộ: tác phẩm viết về giáng sinh hay nhất mọi thời đại</div>
            </div>
            </div>
            </a>
         </div>
       </td>
         <td>
         <div class="wrap">
            <div class="display">
            <a href="http://koha.dreamlib.vn/cgi-bin/koha/opac-detail.pl?biblionumber=6" target="_blank">
            <img  src="http://koha.dreamlib.vn/cgi-bin/koha/opac-image.pl?thumbnail=1&biblionumber=6">
            <div class="caption">
            <div class="growtext">silent millionaire</div>
            </div>
            </div>
            </a>
         </div>
       </td>
         <td>
         <div class="wrap">
            <div class="display">
            <a href="http://koha.dreamlib.vn/cgi-bin/koha/opac-detail.pl?biblionumber=7" target="_blank">
            <img  src="http://koha.dreamlib.vn/cgi-bin/koha/opac-image.pl?thumbnail=1&biblionumber=7">
            <div class="caption">
            <div class="growtext">Record chứa những ảnh cần thiết cho OPAC theme</div>
            </div>
            </div>
            </a>
         </div>
       </td>
         <td>
         <div class="wrap">
            <div class="display">
            <a href="http://koha.dreamlib.vn/cgi-bin/koha/opac-detail.pl?biblionumber=2" target="_blank">
            <img  src="http://koha.dreamlib.vn/cgi-bin/koha/opac-image.pl?thumbnail=1&biblionumber=2">
            <div class="caption">
            <div class="growtext">Đại tướng võ nguyên giáp, một thế kỉ - hai cuộc trường chinh</div>
            </div>
            </div>
            </a>
         </div>
       </td>
         <td>
         <div class="wrap">
            <div class="display">
            <a href="http://koha.dreamlib.vn/cgi-bin/koha/opac-detail.pl?biblionumber=3" target="_blank">
            <img  src="http://koha.dreamlib.vn/cgi-bin/koha/opac-image.pl?thumbnail=1&biblionumber=3">
            <div class="caption">
            <div class="growtext">Những tỷ phú tình cờ - sự hình thành facebook </div>
            </div>
            </div>
            </a>
         </div>
       </td>
</ul>
</div>
	<!-- Call the bxSlider -->
<script type="text/javascript">
$(document).ready(function(){
  $('.bxslider').bxSlider({
  minSlides: 4,
  maxSlides: 4,
  speed: 300,
  easing:'ease',
  slideWidth: 160,
  slideMargin: 0, auto: true
});
});
</script>
<script type="text/javascript">
$(window).load(function() {
$(".bxslider li img").each(function(){			
			var imageWidth = 0;
			var imageHeight = 0;
var theImage = new Image();
theImage.src = $(this).attr("src");
		imageWidth = theImage.width;
		imageHeight = theImage.height;
            if ((imageWidth == 1) || (imageHeight == 1)) {
                //this.src = './images/noimage.jpg';
                this.src = './images/noimage.gif';
            }
	});
	});
</script>
</body>
</html>
